<template>
	<view class="content">
		<view class="head-box">
			<view class="box-title">
				<text>商品名称</text>
			</view>
			<view class="box-inp">
				<input type="text" maxlength=15  v-model="goodsName"  placeholder="请输入商品名称"/> <!-- v-model="userNmae" --> 
			</view>
		</view>
		<view class="head-box">
			<view class="box-title">
				<text>商品数量</text>
			</view>
			<view class="box-inp">
				<input type="number" maxlength=15 v-model="goodsNumber"  placeholder="请输入商品数量" /> <!-- v-model="userNmae" --> 
			</view>
		</view>
		<view class="head-box">
			<view class="box-title">
				<text>商品单价</text>
			</view>
			<view class="box-inp">
				<input type="text" maxlength=15  v-model="goodsPrice"  placeholder="请输入商品单价" /> <!-- v-model="userNmae" --> 
			</view>
		</view>
		<view class="head-box">
			<view class="box-title">
				<text>客户手机号</text>
			</view>
			<view class="box-inp">
				<input type="number" maxlength=11  v-model="phone"   placeholder="请输入客户手机号"/> <!-- v-model="userNmae" --> 
			</view>
		</view>
		<view class="head-box">
			<view class="box-title">
				<text>备注</text>
			</view>
			<view class="box-inp">
				<input type="text" maxlength=30  v-model="remarks"   placeholder="备注信息选填"/> <!-- v-model="userNmae" --> 
			</view>
		</view>
		<view class="uni-padding-wrap uni-common-mt">
			<view class="demo" @click="chooseImage">
				<block v-if="headImg">
					<image :src="headImg" class="image" mode="widthFix"></image>
				</block>
				<block v-else>
					<view class="uni-hello-addfile" >+ 选择图片</view>
				</block>
			</view>
		</view>
		<button type="primary" @click="next">提交订单</button>
	</view>
</template>

<script>
  import eonfox from '@/components/eonfox/eonfox.js';
  import fns from '@/components/eonfox/fns.js';
  var ef = new eonfox();
  export default {
    data() {
		return {
			title: 'uploadFile',
			headImg: '',
			merchantID:'',
			goodsName:'',
			goodsNumber:'',
			goodsPrice:'',
			phone:'',
			remarks:''
			};
        },
		onLoad:function() {
			this.load();
		},
		methods:{
			chooseImage: function() {
				var _this=this;
				uni.chooseImage({
					count: 1,
					sizeType: ['compressed'],
					sourceType: ['album'],
					success: (res) => {
						console.log('chooseImage success, temp path is', res.tempFilePaths[0])
						var imageSrc = res.tempFilePaths[0]
						ef.left_token(function(left_token){
							//encodeURIComponent  encodeURI
							var uploadUrl=ef.api_server_url+"?"+encodeURI('data=[["MERCHANTTALLYSELFUPLOADVOUCHER",[{"merchant_id":"'+_this.merchantID+'"}]]]')+"&token="+left_token;
							uni.uploadFile({
								url: uploadUrl,
								filePath: imageSrc,
								fileType: 'image',
								name: 'file',
								success: (res) => {
									
									console.log('上传成功:',res.data)
									uni.showToast({
										title: '上传成功',
										icon: 'success',
										duration: 1000,
										success() {
											_this.headImg = imageSrc
										}
									})
								},
								fail: (err) => {
									console.log('uploadImage fail', err);
									uni.showModal({
										content: err.errMsg,
										showCancel: false
									});
								}
							});
						});
					},
					fail: (err) => {
						console.log('chooseImage fail', err)
						uni.showToast({
							title:JSON.stringify(err),
							icon: 'none',
							duration:2000
						})
					}
				})
			},
			next(){	
				var that=this;
				ef.submit({
					request:{
						s: ['MERCHANTTALLYSELFADD', [{
							merchant_id:that.merchantID,
							goods_name:that.goodsName,
							goods_number:that.goodsNumber,
							goods_money:that.goodsPrice*100,
							client_phone:that.phone,
							comment:that.comment
							}]]
					},
					callback: function(data) {
						console.log('回调成功', data);
						var	fns_=fns.checkError(data,['s'],function(erron, error){
							uni.showToast({
								title: error,
								icon:'none'
							})
							// return;
							});
						     if(data.data.s.data){
								 uni.showToast({
								 	title:'提交成功',
									success() {
										setTimeout(function(){
											uni.switchTab({
													url: '../../pages/me/me'
												});
										},1500)
									}
								 })
							 }
							},
					error: function(err) {
						uni.showToast({
							title:'出错啦',
							icon:'none'
						})
					}
					
				});
			},
			load(){
				var that=this;
			     ef.submit({
					request:{
						sj: ['MERCHANTSELF'],
					},
					callback: function(data) {
						var	fns_=fns.checkError(data,['sj'],function(erron, error){
 							uni.showToast({
 								title: error,
 								icon: 'none'
 							})
							});
							var merchant=data.data.sj.data;
							that.merchantID=merchant[0].id
							console.log(that.merchantID);
							},
					error: function(err) {
						uni.showToast({
							title:'出错啦',
							icon:'none'
						})
					}
					
				});
			}
		}
	}
   
</script>

<style>
	.image {
		width: 100%;
	}
	
	.demo {
		
		padding: 50upx;
		margin-top: 30upx;
		border: 1upx #D8D8D8 solid;
		color: #8F8F94;
	}
	.content{
		width:94%;
		height: auto;
		margin-left: 2%;
		font-size: 15px;
	}
	.head-box{
		width: 100%;
		height: 60px;
		border-bottom:1px solid #e8e8e8 ;
		line-height: 60px;
	}
	.box-title{
		width: 30%;
		height: 60px;
		line-height: 60px;
		float: left;
	}
	.box-inp{
		width: 50%;
		height: 60px;
		line-height: 60px;
		float: right;
		text-align: right;
	}
	.box-inp input{
		float: left;
		width: 100%;
		height:60px;
		
	}
	
	button{
		margin-top: 80px;
		background :#F76968;
		color: #fff;
	}
	image{
		width:40px;
		height:40px;
		margin-top: 10px;
		}
</style>
